<!-- Page Content -->
<div id="page-content-wrapper">
  <div class="container-fluid">
    <div class="row">
      <div class="col-md-12">
        <br><br>
        <div class="text-center"id="title">
          <a class="h2">All Articles</a>
        </div>
        <br>
      </div>
      <div class="col-md-9"> <!-- Change width here -->
        <!-- Category: Computer Science -->
        <div class="page-header" id="ComputerScience">
          <h3>Computer Science</h3>
        </div>

        <ul class="ant-timeline" id="archivelist-cs">
          
          {% for post in site.posts %}
          
          {% if post.category != "ComputerScience" %}
          {% continue %}
          {% endif %}
          
          <li class="ant-timeline-item">
            <div class="ant-timeline-item-content">
              
              <div class="d-flex align-items-center post-title">
                <a class="post-link h5 text-primary" href="{{site.url}}{{site.baseurl}}{{ post.url}}">{{ post.title }}</a>
              </div><br>
              <span class="text-danger h6">&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp  &nbsp{{ post.date | date: "%Y-%m-%d" }} &nbsp&nbsp</span>
              <span class="text-danger h6">&nbsp&nbsp ▪ &nbsp{{post.tags}}</span>
            </div>
          </li>
          {% endfor %}
        </ul>
        <!-- Category End -->
        <!-- Category: Literary Works -->
          <h3>Literary Works</h3>
        <div class="page-header" id="LiteraryWorks">
        </div>

        <ul class="ant-timeline" id="archivelist-cs">
          
          {% for post in site.posts %}
          
          {% if post.category != "LiteraryWorks" %}
          {% continue %}
          {% endif %}
          
          <li class="ant-timeline-item">
            <div class="ant-timeline-item-content">
              
              <div class="d-flex align-items-center post-title">
                <a class="post-link h5 text-primary" href="{{site.url}}{{site.baseurl}}{{ post.url}}">{{ post.title }}</a>
              </div><br>
              <span class="text-danger h6">&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp  &nbsp{{ post.date | date: "%Y-%m-%d" }} &nbsp&nbsp</span>
              <span class="text-danger h6">&nbsp&nbsp ▪ &nbsp{{post.tags}}</span>
            </div>
          </li>
          {% endfor %}
        </ul>
        <!-- Category End -->
        <!-- Category: Translation -->
        <div class="page-header" id="Translation">
          <h3>Translation</h3>
        </div>

        <ul class="ant-timeline" id="archivelist-cs">
          
          {% for post in site.posts %}
          
          {% if post.category != "Translation" %}
          {% continue %}
          {% endif %}
          
          <li class="ant-timeline-item">
            <div class="ant-timeline-item-content">
              
              <div class="d-flex align-items-center post-title">
                <a class="post-link h5 text-primary" href="{{site.url}}{{site.baseurl}}{{ post.url}}">{{ post.title }}</a>
              </div><br>
              <span class="text-danger h6">&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp  &nbsp{{ post.date | date: "%Y-%m-%d" }} &nbsp&nbsp</span>
              <span class="text-danger h6">&nbsp&nbsp ▪ &nbsp{{post.tags}}</span>
            </div>
          </li>
          {% endfor %}
        </ul>
        <!-- Category End -->
        <!-- Category: Others -->
        <div class="page-header" id="Others">
          <h3>Others</h3>
        </div>

        <ul class="ant-timeline" id="archivelist-cs">
          
          {% for post in site.posts %}
          
          {% if post.category != "Others" %}
          {% continue %}
          {% endif %}
          
          <li class="ant-timeline-item">
            <div class="ant-timeline-item-content">
              
              <div class="d-flex align-items-center post-title">
                <a class="post-link h5 text-primary" href="{{site.url}}{{site.baseurl}}{{ post.url}}">{{ post.title }}</a>
              </div><br>
              <span class="text-danger h6">&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp  &nbsp{{ post.date | date: "%Y-%m-%d" }} &nbsp&nbsp</span>
              <span class="text-danger h6">&nbsp&nbsp ▪ &nbsp{{post.tags}}</span>
            </div>
          </li>
          {% endfor %}
        </ul>
        <!-- Category End -->
      </div>
      
      <div class="col-md-3"> 
	<!-- Categories -->
        <div class="page-header" id="categories">
          <h3>Categories </h3>
        </div>
        <ul class="h6">
          {% for cat in site.categories %}
	  
          <a class="text-primary" href="{{site.url}}{{site.baseurl}}/archives.html#{{cat[0]}}">
            {{cat[0]}}
          </a>&nbsp
          {% endfor %}
        </ul>
	<!-- Tags -->
        <div class="page-header" id="tags">
          <h3>Tags </h3>
        </div>
        <ul class="h6">
          {% for tag in site.tags %}
	  
          <a class="text-primary" href="{{site.url}}{{site.baseurl}}/categories.html#t_{{tag[0]}}">
            {{tag[0]}}
          </a>&nbsp
          {% endfor %}
        </ul>
      </div>
    </div>
  </div>
  <!-- /#page-content-wrapper -->
